<template>
    <div class="all">
        <div class="header">
            <span class="x" @click="funx">×</span>
            <span class="reg" @click="reg">注册</span>
        </div>
        <h1>手机快捷登录</h1>
        <span class="title">未注册过的手机号将自动创建贝壳账号，经纪人不会看到您的手机号</span>
        <br>
        <input type="text" placeholder="请输入手机号">
        <br>
        <input type="text" placeholder="请输入密码">
        <button class="log" @click="login">登录</button>
        <p class="try">账号密码登录</p>
        <br>
        <p>注册/登录即代表同意<a href="#">《贝壳隐私政策》</a>及<a href="#">《贝壳用户使用协议》</a></p>
    </div>
</template>

<script>
export default{
    methods: {
        funx(){
            console.log("wsw");
        },
        reg(){
            console.log("register");
        },
        login(){
            console.log("login");
        }
    },
}
</script>

<style lang='stylus' scoped>
.all
    width 100%
    height 100%
    padding 0.1rem 0.2rem
.header
    display flex
    justify-content space-between
.x
    font-size 0.35rem
    color #aaa
.reg
    font-size 0.18rem
    margin-top 0.18rem
    color #aaa
h1
    font-size 0.28rem
    margin-top 0.1rem
.title
    font-size 0.16rem
    color #999
input 
    width 100%
    border: none;
    outline: none;
    margin-top 0.3rem
    height 0.4rem
.log
    margin-top 0.25rem
    height 0.45rem
    width 100%
    font-size 0.18rem
    color #fff
    font-weight bold
    background-color #3072F6
    border none
    border-radius 0.08rem
    margin-bottom 0.25rem
.try
    text-align center
</style>